import { useState, useCallback, useEffect } from 'react';
import { useLocalStorage } from './useLocalStorage';
import { TitleConfig } from '../types';
import { message } from 'antd';

/**
 * 默认预设样式 - 与实际ECharts格式完全一致
 */
const DEFAULT_PRESETS: Record<string, TitleConfig> = {
  '简约': {
    show: true,
    text: '数据可视化',
    subtext: '',
    textAlign: 'center',
    left: 'center',
    top: 'top',
    textStyle: {
      color: '#333333',
      fontSize: 18,
      fontWeight: 'bold'
    },
    subtextStyle: {
      color: '#999999',
      fontSize: 12
    }
  },
  '商务蓝': {
    show: true,
    text: '数据可视化',
    subtext: '数据来源: 业务部门',
    textAlign: 'left',
    left: 'left',
    top: 'top',
    textStyle: {
      color: '#1890ff',
      fontSize: 20,
      fontWeight: 'bold',
      fontFamily: 'Arial'
    },
    subtextStyle: {
      color: '#666666',
      fontSize: 12,
      fontStyle: 'italic'
    },
    padding: [15, 10, 10, 10],
    backgroundColor: '#f9f9f9',
    borderRadius: 4
  },
  '科技风': {
    show: true,
    text: '数据可视化',
    subtext: '技术驱动未来',
    textAlign: 'center',
    left: 'center',
    top: 'top',
    textStyle: {
      color: '#0066cc',
      fontSize: 22,
      fontWeight: 'bold',
      fontFamily: 'Roboto'
    },
    subtextStyle: {
      color: '#444444',
      fontSize: 14
    },
    padding: [20, 15, 15, 15],
    backgroundColor: 'rgba(240, 248, 255, 0.8)',
    borderRadius: 8,
    shadowColor: 'rgba(0, 0, 0, 0.2)',
    shadowBlur: 10,
    shadowOffsetX: 0,
    shadowOffsetY: 5
  },
  '深色主题': {
    show: true,
    text: '数据可视化',
    subtext: '2023年数据',
    textAlign: 'center',
    left: 'center',
    top: 'top',
    textStyle: {
      color: '#ffffff',
      fontSize: 20,
      fontWeight: 'bold'
    },
    subtextStyle: {
      color: '#cccccc',
      fontSize: 12
    },
    padding: [15, 10, 10, 10],
    backgroundColor: '#333333',
    borderRadius: 4
  }
};

export interface TitlePreset {
  name: string;
  config: TitleConfig;
  isDefault: boolean;
}

/**
 * 标题预设钩子 - 管理标题样式预设
 */
export function useTitlePresets() {
  // 从本地存储加载用户自定义预设
  const [customPresets, setCustomPresets] = useLocalStorage<Record<string, TitleConfig>>(
    'chart-editor-title-presets',
    {}
  );

  // 合并默认预设和自定义预设
  const [allPresets, setAllPresets] = useState<TitlePreset[]>([]);

  // 在默认预设和自定义预设变化时更新所有预设
  useEffect(() => {
    const presetArray: TitlePreset[] = [
      ...Object.entries(DEFAULT_PRESETS).map(([name, config]) => ({
        name,
        config,
        isDefault: true
      })),
      ...Object.entries(customPresets).map(([name, config]) => ({
        name,
        config,
        isDefault: false
      }))
    ];

    setAllPresets(presetArray);
  }, [customPresets]);

  // 保存当前配置为新预设
  const saveAsPreset = useCallback((name: string, config: TitleConfig) => {
    if (!name.trim()) {
      message.error('预设名称不能为空');
      return false;
    }

    // 检查是否与默认预设重名
    if (Object.keys(DEFAULT_PRESETS).includes(name)) {
      message.error('不能覆盖默认预设');
      return false;
    }

    setCustomPresets(prev => ({
      ...prev,
      [name]: JSON.parse(JSON.stringify(config)) // 深拷贝确保不受后续修改影响
    }));

    message.success(`预设 "${name}" 已保存`);
    return true;
  }, [setCustomPresets]);

  // 删除自定义预设
  const deletePreset = useCallback((name: string) => {
    // 检查是否为默认预设
    if (Object.keys(DEFAULT_PRESETS).includes(name)) {
      message.error('不能删除默认预设');
      return false;
    }

    setCustomPresets(prev => {
      const newPresets = { ...prev };
      delete newPresets[name];
      return newPresets;
    });

    message.success(`预设 "${name}" 已删除`);
    return true;
  }, [setCustomPresets]);

  return {
    allPresets,
    customPresets,
    saveAsPreset,
    deletePreset
  };
}
